<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head lang="en">
    <meta charset="UTF-8">
    <title>潮人电商后台</title>
    <link rel="stylesheet" href="css/public.css"/>
    <link rel="stylesheet" href="css/style.css"/>
    <script type="text/javascript" src="/bootstarp/js/jquery-1.8.3.js"></script>
</head>
<body>
<!--头部-->
<header class="publicHeader">
    <h1>潮人管理系统</h1>

    <div class="publicHeaderR">
        <p><span>下午好！</span><span style="color: #fff21b"  th:text="${session.user.UAccount}"> Admin</span> , 欢迎你！</p>
        <a href="/logout">退出</a>
    </div>
</header>
<!--时间-->
<section class="publicTime">
    <span id="time">2015年1月1日 11:11  星期一</span>
    <a href="#">温馨提示：为了能正常浏览，请使用高版本浏览器！（IE10+）</a>
</section>
<!--主体内容-->
<section class="publicMian ">
    <div class="left">
        <h2 class="leftH2"><span class="span1"></span>功能列表 <span></span></h2>
        <nav>
            <ul class="list">
                <li ><a href="/productPage">商品管理</a></li>
                <li><a href="/orderFromPage">订单管理</a></li>
                <li><a href="/gongyingPage">供应商管理</a></li>
                <li><a href="/yuangongPage">员工管理</a></li>
                <li><a href="/passwordPage">密码修改</a></li>
                <li><a href="/logout">退出系统</a></li>
            </ul>
        </nav>
    </div>
    <div class="right">
        <div class="location">
            <strong>你现在所在的位置是:</strong>
            <span>商品管理页面 >> 商品添加页面</span>
        </div>
        <div class="providerAdd">
            <form action="/addProduct" id="addProduct" method="post">
                <!--div的class 为error是验证错误，ok是验证成功-->
                <input type="hidden" id="ok" name="proImage"/>
                <div>
                    <label for="billName">商品名称：</label>
                    <input type="text" name="proName" id="billName" required/>
                    <span >*请输入商品名称</span>
                </div>
				
				 <div>
				    <label >供应商：</label>
				    <select name="gId" id="gId">
				        <option value="">--请选择供应商--</option>

				
				    </select>
				    <span>*</span>
				</div>
               
                <div>
                    <label for="billNum">商品库存：</label>
                    <input type="text" name="proKucun" id="billNum" required/>
                    <span>*请输入大于0的正自然数</span>
                </div>
                <div>
                    <label for="money">单价：</label>
                    <input type="text" name="proPrice" id="money" required/>
                    <span>*请输入大于0的正自然数，小数点后保留2位</span>
                </div>
                <div>
                    <label >是否上架：</label>
                    <select name="proPutaway" >
                        <option value="">--请选择--</option>
                        <option value="0">上架</option>
                        <option value="1">不上架</option>

                    </select>
                    <span>*</span>
                </div>
				
				 <div>
				    <label for="img">商品预览：</label>
				    <input type="file" name="proImage" id="img" value="" required onchange="yulan()"/>
				    <img src=""  id="hehe"/>
				</div>
                
                <div class="providerAddBtn">
                    <!--<a href="#">保存</a>-->
                    <!--<a href="billList.html">返回</a>-->
                    <input type="button" value="保存"  onclick="add()"/>
                    <input type="button" value="返回" onclick="history.back(-1)"/>
                </div>
            </form>
        </div>

    </div>
</section>
<footer class="footer">
</footer>
<script src="js/time.js"></script>


<script>
       
       function yulan() {

          var formData=  new FormData();
           var file = $("#img")[0].files[0];
           formData.append("file",file);

           $.ajax({

               url:"/shangchuang",
               type:"post",
               contentType:false,
               processData:false,
               data:formData,
               success:function (data) {


                   if (data.code==4){
                       alert("上传失败");
                   }

                   if (data.code==0){

                       alert("上传成功");
                       $("#ok").val(data.data);
                   }

                   $("#hehe").prop("src","/img/"+data.data);
               }
           })
       }


       $(function () {


             $.ajax({

                 url:"/selectAll",
                 type:"get",
                 success:function (data) {


                       if (data.gongYings!=null){

                           alert("下拉框查询成功");
                       }

                      parse(data.gongYings);
                 }

             })
       })


     function parse(data) {

           for (var index in data) {

                var sb= data[index];

                $("#gId").append(

                "<option value="+sb.gid+">"+sb.gname+"</option>"

           )

           }
     }


     function add() {

           $.ajax({

               url:"/addProduct",
               type:"post",
               data:$("#addProduct").serialize(),
               success:function (data) {

                   if (data.code==0){

                       alert("添加商品成功");
                       location.href="http://localhost:8080/productPage";
                   }

                   if (data.code==4){

                       alert("添加商品失败");
                   }
               }
           })
     }
</script>

</body>
</html>